let blogId = null;
let bloggerId = null;
let likeButton = null;
let collectButton = null;
let attentionButton = null;
let unAttentionButton = null;
let viewUserButton = null;
let detailBackButton = null;

$(function () {
    blogId = $('#blogId');
    bloggerId = $('#bloggerId');
    likeButton = $('#likeButton');
    collectButton = $('#collectButton');
    attentionButton = $('#attentionButton');
    unAttentionButton = $('#unAttentionButton');
    viewUserButton = $('#viewUserButton');
    detailBackButton = $('#detailBackButton');

    // 入场判断是否关注过该博主
    $.ajax({
        type: "GET",
        url: path + "/user/check",
        data: {bloggerId: bloggerId.val(), blogId: blogId.val()},
        dataType: "json",
        success: function (data) {
            let text = null;
            if (data.msg === "followed") {

                text = "<button type=\"button\" class=\"btn btn-sm btn-warning\" name=\"unAttention-btn\" id=\"unAttentionButton\" style=\"margin: 5px\">\n" +
                    "                                <span class=\"glyphicon glyphicon-heart\"></span>&nbsp;已关注 \n" +
                    "                            </button>";
                document.getElementById("attentionButton").outerHTML = text;
            } else if (data.msg === "same") {

                attentionButton.attr("disabled", true);
            }

            if (data.likes === "yes") {
                text = "                        <button type=\"button\" class=\"btn btn-sm btn-default\" name=\"unlike-btn\" id=\"unlikeButton\"\n" +
                    "                                style=\"background-color: pink; margin-right: 15px\"><span\n" +
                    "                                class=\"glyphicon glyphicon-thumbs-up\"></span>&nbsp;已点赞\n" +
                    "                        </button>";
                document.getElementById("likeButton").outerHTML = text;
            }

            if (data.collect === "yes") {
                text = "                        <button type=\"button\" class=\"btn btn-sm btn-default\" name=\"unCollect-btn\" id=\"unCollectButton\"\n" +
                    "                                style=\"background-color: orange\"><span class=\"glyphicon glyphicon-star-empty\"></span>&nbsp;已收藏\n" +
                    "                        </button>";
                document.getElementById('collectButton').outerHTML = text;
            }
        },
        error: function () {
            alert("check_ajax 出现错误");
        }
    })

    // 关注按钮的两个时间，以及动态改变关注按钮的样式
    $("body").on("click", '#attentionButton', function () {
        $.ajax({
            type: "GET",
            url: path + "/user/attention",
            data: {bloggerId: bloggerId.val()},
            dataType: "json",
            success: function (data) {
                if (data.msg === "success") {
                    let text = "<button type=\"button\" class=\"btn btn-sm btn-warning\" name=\"unAttention-btn\" id=\"unAttentionButton\" style=\"margin: 5px\">\n" +
                        "                                <span class=\"glyphicon glyphicon-heart\"></span>&nbsp;已关注 \n" +
                        "                            </button>";
                    alert("关注成功!O(∩_∩)O~");
                    document.getElementById("attentionButton").outerHTML = text;
                } else {
                    alert("系统出错，关注失败");
                }
            },
            error: function () {
                alert("attention_ajax 出现错误");
            }
        })
    }).on("click", '#unAttentionButton', function () {
        if (!confirm('确定要取消关注吗? ┭┮﹏┭┮')) return;
        $.ajax({
            type: "GET",
            url: path + "/user/unAttention",
            data: {bloggerId: bloggerId.val()},
            dataType: "json",
            success: function (data) {
                if (data.msg === "success") {
                    let text = "<button type=\"button\" class=\"btn btn-sm btn-success\" name=\"attention-btn\" id=\"attentionButton\" style=\"margin: 5px\">\n" +
                        "                                <span class=\"glyphicon glyphicon-heart-empty\"></span>&nbsp;关注 ta\n" +
                        "                            </button>";
                    alert("取关成功 ┭┮﹏┭┮ ");
                    document.getElementById("unAttentionButton").outerHTML = text;
                } else {
                    alert("系统出错，取关失败");
                }
            },
            error: function () {
                alert("unAttention_ajax 出现错误");
            }
        })
    }).on("click", '#likeButton', function () {
        $.ajax({
            type: "GET",
            url: path + "/user/like/" + blogId.val(),
            dataType: "json",
            success: function (data) {
                let text = "";
                if (data.msg === "success") {
                    alert("谢谢你的点赞！(*^▽^*)");
                    text = "                        <button type=\"button\" class=\"btn btn-sm btn-default\" name=\"unlike-btn\" id=\"unlikeButton\"\n" +
                        "                                style=\"background-color: pink; margin-right: 15px\"><span\n" +
                        "                                class=\"glyphicon glyphicon-thumbs-up\"></span>&nbsp;已点赞\n" +
                        "                        </button>";
                    document.getElementById("likeButton").outerHTML = text;
                }
            },
            error: function () {
                alert("ajax出现错误");
            }
        })
    }).on("click", '#unlikeButton', function () {
        $.ajax({
            type: "GET",
            url: path + "/user/unlike/" + blogId.val(),
            dataType: "json",
            success: function (data) {
                let text = "";
                if (data.msg === "success") {
                    alert(" (┭┮﹏┭┮) 我会继续努力的 ");
                    text = "                        <button type=\"button\" class=\"btn btn-sm btn-default\" name=\"like-btn\" id=\"likeButton\"\n" +
                        "                                style=\"background-color: grey; margin-right: 15px\"><span\n" +
                        "                                class=\"glyphicon glyphicon-thumbs-up\"></span>&nbsp;点赞\n" +
                        "                        </button>";
                    document.getElementById("unlikeButton").outerHTML = text;
                }
            },
            error: function () {
                alert("ajax出现错误");
            }
        })
    }).on("click",'#collectButton',function () {
        $.ajax({
            type: "GET",
            url: "/user/collect/"+blogId.val(),
            dataType: "json",
            success: function (data) {
                let text = null;
                if (data.collect === "success") {
                    alert("收藏成功 ~ ");
                    text = "                        <button type=\"button\" class=\"btn btn-sm btn-default\" name=\"unCollect-btn\" id=\"unCollectButton\"\n" +
                        "                                style=\"background-color: orange\"><span class=\"glyphicon glyphicon-star-empty\"></span>&nbsp;已收藏\n" +
                        "                        </button>";
                    document.getElementById('collectButton').outerHTML = text;
                }
            },
            error: function () {
                alert("collect_ajax出现错误");
            }

        })
    }).on("click",'#unCollectButton',function () {
        $.ajax({
            type: "GET",
            url: "/user/unCollect/"+blogId.val(),
            dataType: "json",
            success: function (data) {
                let text = null;
                if (data.collect === "success") {
                    alert("已经取消收藏 ~ ");
                    text = "                        <button type=\"button\" class=\"btn btn-sm btn-default\" name=\"collect-btn\" id=\"collectButton\"\n" +
                        "                                style=\"background-color: grey\"><span class=\"glyphicon glyphicon-star-empty\"></span>&nbsp;收藏\n" +
                        "                        </button>";
                    document.getElementById('unCollectButton').outerHTML = text;
                }
            },
            error: function () {
                alert("unCollect_ajax出现错误");
            }
        })
    })



    viewUserButton.on("click", function () {
        window.location.href = "/user/toViewBlogger/" + bloggerId.val();
    })


    detailBackButton.on("click", function () {
        if (referer !== undefined
            && null !== referer
            && "" !== referer
            && "null" !== referer
            && referer.length > 4) {
            window.location.href = referer;
        } else {
            history.back(-1);
        }
    });

    // 点击头像，新窗口中展示
    $("#bloggerImage").on("click", function () {
        let src = $(this).attr("src");
        window.open(src);
    })

})